<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="../css/base.css"/>
    <link rel="stylesheet" type="text/css" href="../css/new_file.css"/>
    <title></title>
</head>
<body>
<div class="header">
    <div class="nav">
        <h2>
            <a href="../index.html"><img src="../img/logo.png" alt=""></a>
        </h2>
        <div class="list_nav">
            <ul>
                <li><a href="../index.html">首页</a></li>
                <li class="list_one">
                    云道商场<span><img src="../img/top.png" alt=""></span>
                    <ul class="caidan">
                        <li class="li_one">
                            <a href="#">云商场产品</a>
                        </li>
                        <li>
                            <a href="pingtai.html">
                                <p>官网云商场</p>
                                <p>免费、简单、高逼格,适用于中小企业的官方快捷商场系统</p>
                            </a>
                        </li>
                        <li>
                            <a href="yx.html">
                                <p>品牌综合商场</p>
                                <p>免费、简单、高逼格,适用于中小企业的官方快捷商场系统</p>
                            </a>
                        </li>
                        <li>
                            <a href="index.html">
                                <p>多店铺品牌商场</p>
                                <p>免费、简单、高逼格,适用于中小企业的官方快捷商场系统</p>
                            </a>
                        </li>
                    </ul>
                </li>
                <li><a href="#">智慧门店</a></li>
                <li><a href="marke.html">营销平台</a></li>
                <li><a href="people.html">媒体联盟</a></li>
                <li><a href="#">关于云道</a></li>
            </ul>

        </div>
        <div class="list_two">
            用户中心<span><img src="../img/top.png" alt=""></span>
            <ul class="user">
                <li><a href="#">官网商场管理</a></li>
                <li><a href="#">媒体处理</a></li>
                <li><a href="#">官网商场管理</a></li>
            </ul>
        </div>
    </div>
</div>
<div class="cons clarefix">
    <div class="banners">
        <div class="a_1">
            <a href="#">官网云商城系统</a>
        </div>
        <div class="p_1">
            <p>免费空间，一键创建，无需运维，全渠道符合营销...</p>
            <p>我们所做的一切，就是帮助中小企业轻松创建高逼格的官方商城！</p>
        </div>
        <div class="a_2">
            <a href="#">马上使用</a>
        </div>
    </div>
    <div class="ban_bottom clarefix">
        <ul class="clarefix">
            <li><a href="#"><img src="../img/car1.png"/></a>
                <h2>供货商</h2>
                <p>多渠道货源供销解决方案</p>
            </li>
            <li><a href="#"><img src="../img/car1.png"/></a>
                <h2>供货商</h2>
                <p>多渠道货源供销解决方案</p>
            </li>
            <li><a href="#"><img src="../img/car1.png"/></a>
                <h2>供货商</h2>
                <p>多渠道货源供销解决方案</p>
            </li>
            </a>
            <li><a href="#"><img src="../img/car1.png"/></a>
                <h2>供货商</h2>
                <p>多渠道货源供销解决方案</p>
            </li>
            </a>
        </ul>
    </div>
    <div class="content">
        <div class="cont_box">
            <h3><span></span><a href="#">云商城架构</a><span></span></h3>
            <p>SHOPCMD</p>
        </div>
        <div class="cont_bottom">
            <img src="../img/can.png"/>
        </div>
    </div>

    <div class="cont_div">
        <div class="cont_div1">
            <h3><span></span><a href="#">对行业的探索</a><span></span></h3>
            <p>SHOPCMD</p>
            <a href="#">深度分析不同行业在互联网+环境下的未来</a>
        </div>
        <div class="cont_div2">
            <ul>
                <li><a href="#"><img src="../img/arl1.png"/></a>
                    <h2><a href="#">020业务</a></h2>
                    <p><a href="#">202 business</a></p>
                </li>
                <li><a href="#"><img src="../img/arl1.png"/></a>
                    <h2><a href="#">020业务</a></h2>
                    <p><a href="#">202 business</a></p>
                </li>
                <li><a href="#"><img src="../img/arl1.png"/></a>
                    <h2><a href="#">020业务</a></h2>
                    <p><a href="#">202 business</a></p>
                </li>
                <li><a href="#"><img src="../img/arl1.png"/></a>
                    <h2><a href="#">020业务</a></h2>
                    <p><a href="#">202 business</a></p>
                </li>
            </ul>
        </div>
    </div>
    <div class="lb">
        <div class="lb-box">
            <div class="cont_box">
                <h3><span></span><a href="#">经典案例</a><span></span></h3>
                <p>SHOPCMD</p>
            </div>
            <div class="lb_div">
                <span id="left" class="sp1"><</span>
                <span id="right" class="sp1">></span>
                <div class="lb_div1" id="banner">

                    <ul id="ul1">
                        <li><img src="../img/bom.png"/>
                            <div>
                                <a href="#">帮助小企业</a>
                            </div>
                            <div><img src="../img/sousou.png"/></div>
                        </li>
                        <li><img src="../img/bom.png"/>
                            <div>
                                <a href="#">帮助小企业</a>
                            </div>
                            <div><img src="../img/sousou.png"/></div>
                        </li>
                        <li><img src="../img/bom.png"/>
                            <div>
                                <a href="#">帮助小企业</a>
                            </div>
                            <div><img src="../img/sousou.png"/></div>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>

</div>
<div class="foos">
    <div class="foo_box">
        <ul>
            <li><a href="#">shopomd</a></li>
            <li><a href="#">首页</a></li>
            <li><a href="#">官网云商城</a></li>
            <li><a href="#">智慧门店</a></li>
            <li><a href="#">营销平台</a></li>
            <li><a href="#">媒体联盟</a></li>
            <li><a href="#">关于我们</a></li>
        </ul>
        <p><img src="../img/dianhua.png" alt=""/> 4008-188-360</p>
        <hr/>
        <p><a href="#">Copyright 2015苏州海运网络科技有限公司版权所有 | 苏ICP备15038170号-3</a></p>
    </div>
</div>
</body>
<script src="../js/jquery-3.1.1.min.js"></script>
<script>
    $(function () {
        var n = -2
        $("#banner ul").html($("#banner ul").html() + $("#banner ul").html())
        $("#banner ul").width(3000)
        var timer = null;

        move()
        function move() {
            timer = setInterval(fn, 30)
        }

        function fn() {
            $("#banner ul")[0].style.left = $("#banner ul")[0].offsetLeft + n + "px"
            if ($("#banner ul")[0].offsetLeft <= -$("#banner ul")[0].offsetWidth / 2) {
                $("#banner ul")[0].style.left = 0
            }
            if ($("#banner ul")[0].offsetLeft > 0) {
                $("#banner ul")[0].style.left = -$("#banner ul")[0].offsetWidth / 2 + "px"
            }
        }

        $("#kaishi").click(function () {
            clearInterval(timer);
            move()
        })
        $("#tingzhi").click(function () {
            clearInterval(timer);
        })
        $("#left").click(function () {
            clearInterval(timer);
            n = -2
            move()
        })
        $("#right").click(function () {
            clearInterval(timer);
            n = 2;
            move()
        })
        $("#banner li").click(function () {
            $(this).css("border", "1px solid red")
            $(this).siblings().css("border", "none");
            var $src = $(this).find("img").attr("src");
            $("#tu img").prop("src", $src)
        })
        $("#banner").hover(function () {
            clearInterval(timer);
        }, function () {
            clearInterval(timer);
            move()
        })
        $(".list_one").click(function () {
            $(this).find("ul").stop().slideToggle()
        })
        $(".list_two").click(function () {
            $(this).find("ul").stop().slideToggle()
        })
    })

</script>
</html>
